*{
    background: #0649805e;
    color: aliceblue;
    margin:0.1cm;
    padding:0.2cm;
    font-style:italic;
    font-size: 1.6vw;
    font-family: monospace;
}
html{
    height: 800px;
    width: 1200px;
}
h1{
    text-align: center;
    margin: 1%;
     -webkit-animation: glow 3s ease-in-out infinite alternate;
     -moz-animation: glow 3s ease-in-out infinite alternate;
     animation: glow 3s ease-in-out infinite alternate;
}
@keyframes
glow {
          from {
                  color: #e5e91bd7;
                   text-shadow: 0 0 10px hsl(65, 68%, 49%), 0 0 20px #80ad15be, 0 0 30px hsl(135, 70%, 33%), 0 0 40px #410e29, 0 0 50px #00ff37, 0 0 60px #ff00cc, 0 0 70px #00ff26, 0 0 90px #ff0051;
               }
           to {
                   color: rgb(15, 25, 163);
                   text-shadow: 0 0 10px hsl(244, 92%, 31%), 0 0 20px #744b96b4, 0 0 30px #752880, 0 0 40px #410e29, 0 0 50px #00ff37, 0 0 60px #ff00cc, 0 0 70px #00ff26, 0 0 90px #ff0051;
    
}}
h2{
    font-style: oblique;
    font-family: rokwell;
    
   
    padding: 1px;
    -webkit-animation: glow 6s ease-in-out infinite alternate;
    animation: glow 6s ease-in-out infinite alternate;
}

img{
    max-width: 70%;
    max-height: 70% ;
    
    position: relative;
    padding: 1px;
    margin-left: 15%;
   
    
}
main{
    
    background: rgb(169, 186, 39);
    display: flex;
    flex-direction: row;
    border-radius: 30px;
    text-align: center;
    margin: 0cm;
    transform: translate(5px, 5px);
            transition: transform 0.7s ease;
}
li{
    margin-left: 1cm;
}
#cone{
   
    display: flex;
    flex-direction: row;
    margin-top: auto;
    padding-block: 10px;
    
}
figcaption{
    
    background: rgb(156, 189, 80);
    border-radius: 30px;
    text-align: center;
    cursor: pointer;
    
}
footer{
    background: blue;
    display: flex;
    flex-direction: row;
    text-align: center;
    border-radius: 30px;
    padding: 1%;
    gap: 6cm;   
}
main:hover{
    transform: translate(-5px, -5px);
    background-color: #daa32d;
    cursor: text;
}

#logo{
    background: blue;
    color: brown;
    border-radius: 30px;
    border: 3px solid rgb(150, 179, 47);
}
figure#logo{
    display: flex;
    gap: 6cm;
    flex-direction: row;
    text-align: center;
    padding-left: 10%;
    
}
i{
    transform: rotate3d(1, 1, 1, 5deg);
    transition: transform 0.6s ease;
    
}
i:hover{
    transform: rotate3d(1, 1, 0, -5deg);
    background-color: #1ebb2b;
    cursor: vertical-text;
}


